<template>
<div>

    <slot name="header"></slot>

    <ul>
    <li v-for="(item,index) in data" :key="item.id">
        <slot name="body" :item="item" :index="index"></slot>
    </li>
  
   </ul>

</div>

</template>

<script>
export default {
  props: ["data"],
};
</script>

<style scoped>
div {
    font-size: 18px;
    width: 300px;
}
header {
    background-color:rgb(0, 171, 255);
}

</style>